<!DOCTYPE html>
<html lang="zh-CN">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>服务器错误 | 长南高信车间设备信息管理平台</title>
    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
    <style>
      * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
      }

      body {
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
          "Helvetica Neue", Arial, sans-serif;
        line-height: 1.6;
        color: #333;
        background-color: #f5f5f5;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
      }

      .header {
        height: 60px;
        background-color: #2c3e50;
        color: white;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
      }

      .header-title {
        font-size: 18px;
        font-weight: bold;
        text-align: center;
        flex: 1;
      }

      .header-button {
        background: none;
        border: none;
        color: white;
        font-size: 20px;
        cursor: pointer;
        padding: 10px;
        border-radius: 4px;
        transition: background-color 0.3s;
      }

      .header-button:hover {
        background-color: rgba(255, 255, 255, 0.1);
      }

      .container {
        max-width: 1200px;
        margin: 0 auto;
        padding: 20px;
        flex: 1;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }

      .error-section {
        text-align: center;
        max-width: 600px;
        padding: 40px;
        background-color: white;
        border-radius: 8px;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
      }

      .error-icon {
        width: 120px;
        height: 120px;
        margin-bottom: 20px;
        color: #e67e22;
      }

      .error-title {
        font-size: 48px;
        font-weight: bold;
        margin-bottom: 10px;
        color: #e67e22;
      }

      .error-message {
        font-size: 18px;
        margin-bottom: 30px;
        color: #666;
      }

      .back-home-link {
        display: inline-block;
        background-color: #3498db;
        color: white;
        padding: 12px 24px;
        border-radius: 4px;
        text-decoration: none;
        font-size: 16px;
        transition: background-color 0.3s;
      }

      .back-home-link:hover {
        background-color: #2980b9;
      }

      .contact-info {
        margin-top: 30px;
        font-size: 14px;
        color: #999;
      }

      .contact-info a {
        color: #3498db;
        text-decoration: none;
      }

      .contact-info a:hover {
        text-decoration: underline;
      }

      .footer {
        background-color: #f5f5f5;
        color: #999;
        padding: 20px;
        margin-top: auto;
        font-size: 12px;
      }

      .footer a {
        color: #999;
        text-decoration: none;
      }

      .footer a:hover {
        text-decoration: underline;
      }

      /* 备案号图标样式 */
      .footer-content img,
      .footer-mobile img {
        width: auto;
        height: 1rem;
        margin-right: 5px;
        vertical-align: text-bottom;
      }

      .footer-content {
        max-width: 1200px;
        margin: 0 auto;
        display: flex;
        justify-content: space-between;
        align-items: center;
      }

      .footer-mobile {
        display: none;
        max-width: 1200px;
        margin: 0 auto;
        text-align: center;
        line-height: 1.8;
      }

      @media (max-width: 768px) {
        .footer-content {
          display: none;
        }

        .footer-mobile {
          display: block;
        }
      }
    </style>
  </head>
  <body>
    <header class="header">
      <button class="header-button" onclick="window.history.back();">
        <svg
          width="24"
          height="24"
          viewBox="0 0 24 24"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M15 18L9 12L15 6"
            stroke="white"
            stroke-width="2"
            stroke-linecap="round"
            stroke-linejoin="round"
          />
        </svg>
      </button>
      <div class="header-title">服务器错误</div>
      <button class="header-button" onclick="window.location.href='/'">
        <svg
          width="24"
          height="24"
          viewBox="0 0 24 24"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M4 10L12 4L20 10V19C20 19.5523 19.5523 20 19 20H5C4.44772 20 4 19.5523 4 19V10Z
       M10 15H14V20H10V15Z"
            fill="white"
            fill-rule="evenodd"
            clip-rule="evenodd"
          />
        </svg>
      </button>
    </header>

    <div class="container">
      <div class="error-section">
        <svg
          class="error-icon"
          viewBox="0 0 24 24"
          fill="none"
          xmlns="http://www.w3.org/2000/svg"
        >
          <path
            d="M12 2L2 7l10 5 10-5-10-5z"
            stroke="currentColor"
            stroke-width="2"
          />
          <path d="M2 17l10 5 10-5" stroke="currentColor" stroke-width="2" />
          <path d="M2 12l10 5 10-5" stroke="currentColor" stroke-width="2" />
        </svg>
        <h1 class="error-title">502</h1>
        <p class="error-message">服务器暂时无法处理您的请求，请稍后再试</p>
        <a href="/" class="back-home-link">返回首页</a>
        <div class="contact-info">
          如有问题，请联系管理员
          <a href="mailto:david.deng.hui@qq.com">david.deng.hui@qq.com</a>
        </div>
      </div>
    </div>

    <footer class="footer">
      <div class="footer-content">
        <div class="footer-left">
          <img src="/files/logo.svg" /><a href="/about.php">csngx.cn</a> © 2025
          版权所有 |
          <a
            href="https://www.upyun.com/?utm_source=lianmeng&amp;utm_medium=referral"
            title="加入又拍云联盟！"
            target="_blank"
            ><img src="/files/upyun_logo.svg" style="margin-right: 0" /></a
          >提供CDN加速/云储存服务
        </div>
        <div class="footer-right">
          <img src="/files/icpba.ico" /><a
            href="https://beian.miit.gov.cn/"
            target="_blank"
            rel="noreferrer"
            >湘ICP备17019987号</a
          >
          | <img src="/files/gaba.png" /><a
            href="https://beian.mps.gov.cn/#/query/webSearch?code=43020002000338"
            target="_blank"
            rel="noreferrer"
            >湘公网安备43020002000338号</a
          >
        </div>
      </div>
      <div class="footer-mobile">
        <div>
          <img src="/files/logo.svg" /><a href="/readme.php">csngx.cn</a> © 2025
          版权所有
        </div>
        <div>
          <img src="/files/icpba.ico" /><a
            href="https://beian.miit.gov.cn/"
            target="_blank"
            rel="noreferrer"
            >湘ICP备17019987号</a
          >
        </div>
        <div>
          <img src="/files/gaba.png" /><a
            href="https://beian.mps.gov.cn/#/query/webSearch?code=43020002000338"
            target="_blank"
            rel="noreferrer"
            >湘公网安备43020002000338号</a
          >
        </div>
        <div>
          <a
            href="https://www.upyun.com/?utm_source=lianmeng&amp;utm_medium=referral"
            title="加入又拍云联盟！"
            target="_blank"
            ><img src="/files/upyun_logo.svg" style="margin-right: 0" /></a
          >提供CDN加速/云储存服务
        </div>
      </div>
    </footer>
  </body>
</html>
